'use client'

import { useEffect, useState } from 'react'
import Carousel from './components/Carousel'
import { fetchDashboardItems } from '@/lib/service/dashboard'
interface ElementItem {
  id: string
  name: string
  type: string
  module: string
  description: string
  status: 'active' | 'inactive'
}

export default function DashboardPage() {
  const [items, setItems] = useState<ElementItem[]>([])
  const [loading, setLoading] = useState(false)
  const [testlint, setTest] = useState()

  useEffect(() => {
    async function load() {
      setLoading(true)
      try {
        const data = await fetchDashboardItems({ page: 1, pageSize: 10 })
        setItems(data)
      } catch (e) {
        console.error('获取数据失败', e)
      } finally {
        setLoading(false)
      }
    }

    load()
  }, [])

  return (
    <div className="p-10">
      <h1 className="text-2xl font-bold mb-4">欢迎来到仪表盘</h1>

      {loading && <p>加载中...</p>}

      {!loading && (
        <div className="grid grid-cols-1 gap-4 max-w-screen-xl mx-auto">
          <Carousel items={items} />
        </div>
      )}
    </div>
  )
}
